{% extends "layout/base.html" %}
{% block title %} Profil utilisateur {% endblock %}

{% block content %}
{% include 'layout/header.html' %}
{% include 'layout/infosBox.html' %}
{% if cat > 0 %}
<div id="categories">
	<div id="ajoutCat">
		<h4>Ajouter des Catégories</h4>
		<form method="post" id="ajouterCategorie" action="edit.php?categorie" class="form-elem">
			<select class="selectpicker" name="categorie[]" title="Catégories" multiple>
				<optgroup label="Catégories que vous avez déjà">
				{% for catP in categoriePossessed %}
			    <option disabled="disabled">{{catP.name}}</option>
			    {% endfor %}
			    <optgroup label="Catégories restantes">
			    {% for catM in categorieMissing %}
			    <option value="{{catM.id_categorie}}">{{catM.name}}</option>
			    {% endfor %}
		  	</select>
		  	<input type="submit" name="ajouterCategorie" value="Ajouter des catégories" class="btn btn-primary {{theme.color3}}" />
	  	</form>
	</div>
	<div id="suppCat">
		<h4>Supprimer des Catégories</h4>
		<form method="post" id="supprCategorie" action="edit.php?categorie" class="form-elem">
			<select class="selectpicker" name="categorie[]" title="Catégories" multiple>
				<optgroup label="Catégories que vous avez">
				{% for catP in categoriePossessed %}
			    <option value="{{catP.id_categorie}}">{{catP.name}}</option>
			    {% endfor %}
		  	</select>
		  	<input type="submit" name="supprCategorie" value="Supprimer des catégories" class="btn btn-primary {{theme.color3}}" />
	  	</form>
	</div>	
</div>
{% endif %}
{% if infosP > 0 %}
<div id="infosP">
	<h4>Modifier vos informations personnelles</h4>
	<form method="post" id="modifInfos" action="edit.php?infosP" class="form-elem">
		<label>Ancien votre mot de passe :</label>
		<input type="password" name="password" value="" placeholder=" mot de passe " required/>
		<label>Modifier votre mot de passe :</label>
		<input type="password" name="newP" id="newP" value="" placeholder=" mot de passe " required/>
		<label>Vérification du nouveau mot de passe :</label>
		<input type="password" name="checkP" value="" placeholder=" mot de passe " required/>
	  	<input type="submit" name="modifInfos" value="Modifier vos informations" class="btn btn-primary {{theme.color3}}" />
  	</form>
</div>
{% endif %}
<div class="clr" ></div>
{% include 'layout/module.html' %}
{% include 'layout/footer.html' %}
<script type="text/javascript">
$('#modifInfos').validate({
		rules: {
			password: {
				required: true,
				minlength: 8
			},
			newP: {
				required: true,
				minlength: 8
			},
			checkP: {
				required: true,
				minlength: 8,
				equalTo: "#newP"
			}
		},
		messages: {
			password: {
				required: "Veuillez entrer un mot de passe svp.",
				minlength: "Votre mot de passe doit contenir au moins 8 caractères."
			},
			newP: {
				required: "Veuillez entrer un mot de passe svp.",
				minlength: "Votre mot de passe doit contenir au moins 8 caractères."
			},
			checkP: {
				required: "Veuillez entrer un mot de passe de vérification svp.",
				minlength: "Votre mot de passe doit contenir au moins 8 caractères.",
				equalTo: "Vous n'avez pas rentré le même mot de passe."
			}
		}
	});
</script>
{% endblock %}